<template>
	<div>
	  <!-- 导航条开始 -->
		<navTop></navTop>
	  
	  <div class="py-5"></div>
	
	  <!-- 轮播图 -->
		<carousel></carousel>
	
	  <!-- 产品-->
	  <product></product>
	
	  <!-- 维生素 -->
	  <vitamin></vitamin>
		
	  <!-- 返回顶部按钮 -->
	  <a href="#" class="btn btn-warning border-3 border-secondary  position-fixed rounded-circle back-to-top">
	    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-airplane-fill"
	      viewBox="0 0 16 16">
	      <path
	        d="M6.428 1.151C6.708.591 7.213 0 8 0s1.292.592 1.572 1.151C9.861 1.73 10 2.431 10 3v3.691l5.17 2.585a1.5 1.5 0 0 1 .83 1.342V12a.5.5 0 0 1-.582.493l-5.507-.918-.375 2.253 1.318 1.318A.5.5 0 0 1 10.5 16h-5a.5.5 0 0 1-.354-.854l1.319-1.318-.376-2.253-5.507.918A.5.5 0 0 1 0 12v-1.382a1.5 1.5 0 0 1 .83-1.342L6 6.691V3c0-.568.14-1.271.428-1.849" />
	    </svg>
	  </a>
	
		<van-back-top />
	
	
	  <!-- footer -->
	  <div class="footer p-4">
	    <div class="container">
	      <div class="row">
	        <div class="col-md-4 grid">
	          <h3 class="text-white">关于我们</h3>
	          <p class="fs-50">新鲜和健康的食物选择对于拥有一个健康的身体是至关重要的。新鲜的水果和蔬菜是必不可少的。
	            我们的水果和蔬菜是从该地区最新鲜的农场采摘的，为您提供最营养和美味的选择</p>
	        </div>
	        <div class="col-md-4 grid">
	          <h3 class="text-white">导航</h3>
	          <ul>
	            <li class="text"><a href="about.html">首页</a></li>
	            <li class="text"><a href="typography.html">产品</a></li>
	            <li class="text"><a href="icons.html">关于我们</a></li>
	            <li class="text"><a href="gallery.html">联系我们</a></li>
	
	          </ul>
	        </div>
	        <div class="col-md-4 grid">
	          <h3 class="text-white">联系我们</h3>
	          <form action="#" method="post">
	            <input type="email" id="mc4wp_email" class="bg-white shadow mb-4 w-100 p-2 fs-25" name="EMAIL"
	              placeholder="Enter your email here" required="">
	            <input type="submit" class="text-dark fs-25 border-1 text-decoration-none p-2" value="Subscribe">
	          </form>
	        </div>
	      </div>
	    </div>
	  </div>
	  <!-- footer -->
	  <!-- copyright -->
	  <div class="copyright bg-dark p-2 text-center">
	    <div class="container">
	      <p class="fs-25 m-0">© hfjsjflsjlfjksdjf . fdsfdsfsdfs| fsdfsdf <a href="#" class="text-decoration-none">
	          fsdfsd</a> </p>
	    </div>
	  </div>
	  <!-- copyright -->
	</div>
</template>

<script>
	import navTop from "./components/navTop.vue"
	import carousel from "./components/carousel.vue"
	import product from "./components/product.vue"
	import vitamin from "./components/vitamin.vue"
	export default {
		name:"nvaTop",
		components:{
			navTop,
			carousel,product,vitamin
		}
	}
</script>

<style scoped>

  h4.number {
    line-height: 60px;
    right: 40px;
    top: 30px;
    opacity: .07;
    transition: 0.3s ease-in-out;
  }  
	
</style>